<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="UTF-8">

        <title>Website of Brett Cannon</title>

        <link rel="icon" type="image/png" href="static/favicon.png">

        <meta name="verify-v1"
              content="5l0w248yaSLWxioC6FCmesvTEAkhjHu0pWEZDWi5Kpo=">

        <link rel="openid2.provider openid.server"
              href="https://www.google.com/accounts/o8/ud">
        <link rel="openid2.local_id openid.delegate"
              href="http://www.google.com/profiles/bcannon">


        <script src="/static/jquery.js"></script>

        <style>
            h1 {
                /* font-size */
                font-weight: normal;
                text-align: center;

                /* border-width */
                border-color: black;
                border-style: solid;
                border-radius: 50px;

                padding: 0px;
                margin: 0px;
            }

            ul {
                text-align: center;

                padding: 0px;
                margin: 0px;
            }

            ul li {
                font-family: sans-serif;
                /* font-size */

                display: inline;
                list-style-type: none;

                background-color: white;

                margin-top: 0px;
                margin-bottom: 0px;
                margin-left: 0.5em;
                margin-right: 0.5em;

                padding-top: 0px;
                padding-bottom: 0px;
                padding-left: 0.25em;
                padding-right: 0.25em;

                position: relative;
                /* top */
            }

            a {
                text-decoration: none;
                color: PaleGreen;
            }

            a:link, a:visited {
                color: PaleGreen;
            }

            li a:hover {
                color: black;
            }
        </style>

        <script>
            function adjust() {
                var maxWidth = $(window).width();
                var nameSize = Math.round(maxWidth/7) + 'px';
                var linkSize = Math.round(maxWidth/24) + 'px';

                $('h1').css({'font-size': nameSize,'border-width': linkSize});

                $('ul li').css('font-size', linkSize).
                           css('top', - $('li').height() + 'px');
           }


           function hoverIn() {
               var color = 'PaleGreen';

               $('h1').css({'border-color': color,
                            'color': color});
           }


           function hoverOut() {
               var color = 'black';

               $('h1').css({'border-color': color,
                            'color': color});
           }


           $(function() {
               adjust();
               $(window).resize(adjust);

               $('a').hover(hoverIn, hoverOut);
           });
        </script>

    </head>
    <body>
        <h1>Brett Cannon</h1>
        <ul>
            <li><a rel="me" href="/about">Who Am I?</a></li>
            <li><a rel="me"
                 href="http://sayspy.blogspot.com">Blog</a></li>
            <li><a rel="me"
                   href="https://docs.google.com/Doc?docid=0AbCvitGf6YffZGc3ZmN0cjRfNDhnNXZrNnpjZw&amp;hl=en">CV</a></li>
            <li><a rel="me"
                   href="http://www.google.com/profiles/bcannon">Profile</a>
            </li>
        </ul>
    </body>
</html>
